<template>
     <div>
         <h1>学生添加</h1>
        <p>学生名字：<input type="text" v-model="stu_name"></p>
        <p>学生年龄：<input type="text" v-model="stu_sex"></p>
        <p>图&emsp;&emsp;片：<input type="file" id="img"></p>
        <p>个人简介：<input type="text" v-model="stu_describe"></p>
        <p>老师：
            <select name="" id="" v-model="teacher">
                <option v-for="tea in teacher_list" :key="tea.id" :value="tea.id">{{tea.name}}</option>
            </select>
        </p>
        <button @click="addstu">添加</button>
    </div>
</template>

<script>
import axios from 'axios'
export default {
    data() {
        return {
            stu_name:'',     
            teacher:0,
            stu_sex:'',
            base_url:'http://127.0.0.1:8000',
            stu_describe:'', 
            teacher_list:[],    
        }
    },
    mounted(){
        this.axios({
            url: this.base_url + '/app01/teacher',
            method:'get'
        }).then(res=>{
            this.teacher_list = res.data
        }).catch(res=>{
            console.log(res.error)
        })
    },
    methods: {
        addstu(){
            let img = document.getElementById('img').files[0];
            let form_data = new FormData()
            form_data.append('stu_name',this.stu_name)
            form_data.append('stu_sex',this.stu_sex)
            form_data.append('stu_icon',img)
            form_data.append('stu_describe',this.stu_describe)
            form_data.append('teacher',this.teacher)
            axios({
                url:this.base_url + '/app01/student_api',
                method:'post',
                data:form_data
            }).then(res =>{
                console.log(res.data)
                alert(res.data.msg)
            })

        },
       
    },
    created() {

    }
}
</script>

<style scoped>

</style>
